﻿@model MyMainSite2.UI.AdminWeb.Models.Admin.YourProfileModel

@{
    ViewBag.Title = String.Format("{0} {1} Profile", this.Model.FirstName, this.Model.LastName.Possessive());
}

@section ScriptLoad {

    loadJavaScript();
}

<script type="text/javascript">

    function loadJavaScript() {

        $("#divUpdateDetailsLoading").hide();

        $("#@this.Html.IdFor(m => this.Model.FirstName), #@this.Html.IdFor(m => this.Model.LastName)").keypress(function (e) {

            if ((e.which && e.which == 13) || (e.keyCode && e.keyCode == 13)) {

                $("#buttonUpdateDetails").click();
            }
        });

        $("#buttonUpdateDetails").click(function () {

            clearErrors();

            var userName = $("#@this.Html.IdFor(m => this.Model.FirstName)").val().trim();
            var password = $("#@this.Html.IdFor(m => this.Model.LastName)").val().trim();

            if (userName.length <= 0) {

                addError("Please enter a First Name.");
            }

            if (password.length <= 0) {

                addError("Please enter a Last Name.");
            }

            var hasErrors = showErrors();

            if (!hasErrors) {

                updateDetails();
            }
        });
    }

    function updateDetails() {

        $("#divUpdateDetailsLoading").show();
        $("#buttonUpdateDetails").hide();

        ajaxRequest("/admin/yourprofile",
            {
                firstName: $("#@this.Html.IdFor(m => this.Model.FirstName)").val(),
                lastName: $("#@this.Html.IdFor(m => this.Model.LastName)").val()
            },
            function (data) {

                displaySuccessMessage("Successfully updated details.");

                $("#divUpdateDetailsLoading").hide();
                $("#buttonUpdateDetails").show();
            },
            function (message) {

                displayErrorMessage(message);

                $("#divUpdateDetailsLoading").hide();
                $("#buttonUpdateDetails").show();
            },
            "POST");
    }

</script>

<article class="module width_3_quarter">
    <header>
        <h3>Details</h3>
    </header>
    <div class="module_content">
        <fieldset>
            <legend></legend>
            <label for="@this.Html.IdFor(m => this.Model.FirstName)">
                First Name:
            </label>
            @this.Html.TextBoxFor(m => this.Model.FirstName)
        </fieldset>
        <fieldset>
            <legend></legend>
            <label for="@this.Html.IdFor(m => this.Model.LastName)">
                Last Name:
            </label>
            @this.Html.TextBoxFor(m => this.Model.LastName)
        </fieldset>
    </div>
    <footer>
        <div class="submit_link">
            <div id="divUpdateDetailsLoading" class="loading"></div>
            <input id="buttonUpdateDetails" type="button" class="alt_btn" value="Update" />
        </div>
    </footer>
</article>